

interface Person{
  name:string
  age:number
}
@Entry
@Component
struct Index {
  //1.简单类型变量
  @State count:number=0
  //2.修饰数组
  @State students:string[]=['小红','小明']
  //3.修饰对象
  @State jack:Person={name:'Jack',age:18}
  build() {
    Column(){
      Row(){
        Text('-')
          .customText()
        Text(this.count.toString())
          .padding(10)
        Text('+')
          .customText()
          .onClick(()=>{
            this.count++
          })
      }
      .margin({bottom:30})
      .justifyContent(FlexAlign.Center)
      .width('100%')

      ForEach(this.students,(item:string,i)=>{
        Row({space:10}){
          Text(item+""+i)
          Text('-')
            .customText()
            .onClick(()=>{
              this.students.splice(i,1)
            })
        }
        .margin(10)
      })
      Button('添加学生')
        .onClick(()=>{
          this.students.push('小丽')
        })

      Row({space:10}){
        Text(this.jack.name)
        Text(this.jack.age.toString())
        Button('明年')
          .onClick(()=>{
            this.jack.age++
          })
      }
      .margin({top:30})
    }
    .width('100%')
    .height('100%')
  }
}

@Extend(Text)
function customText() {
  .width(32)
  .aspectRatio(1)
  .backgroundColor(Color.Gray)
  .borderRadius(16)
  .textAlign(TextAlign.Center)
}
